﻿@using KopSoftWms.Models;
@using YL.Core.Dto;

@{
    var allTitle = ViewBag.Title as List<string>;
    var colCount = allTitle.Count();
    var wid = ((colCount - 1) * 110 + 220).ToString() + "px";
}

@section styles{
    <style>
        #myTable {
            width:100%;
            overflow-x: scroll;
            overflow-y: hidden;
        }

            #myTable tbody {
                display: block;
                height: 450px;
                width: @wid;
                text-align: center;
                overflow-y: scroll;
                overflow-x: hidden;
            }

        #myTable thead,
        #myTable tbody tr {
            display: table;
            width: @wid;
            table-layout: fixed;
        }

            #myTable td {
                padding: 0;
                word-break: break-all;
                word-wrap: break-word;
            }

        /*#myTable tr th:last-child {
            width: 150px;
        }

        #myTable tr td:last-child {
            width: 150px;
        }*/
    </style>
    <link href="~/lib/fileinput/5.0.3/css/fileinput.css" rel="stylesheet" />
}

<div class="content-wrapper">
    <section class="content-header">
        <h1>
            报表管理
            <small>出库表</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li><a href="#">报表管理</a></li>
            <li class="active">出库表</li>
        </ol>
    </section>
    <section class="content">
        <div class="row" style="padding-bottom:1px;">
            <div class="col-md-12">
                <div class="box">
                    <div class="box-body">
                        <div class="input-group">
                            <span class="input-group-addon">出库日期</span>
                            <input type="text" ref="datemax" id="datemax" v-model="datemax" class="form-control" style="width:120px;">
                            <button name="search" v-on:click="searchL" type="submit" class="btn btn-success" style="margin-left:10px;"><i class="fa fa-search"></i> 搜出库</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-body">
                        <div id="toolbar" class="btn-group">
                            <button id="btn_export" v-on:click="exportL" type="button" class="btn btn-default">
                                <span class="glyphicon glyphicon-export" aria-hidden="true"></span>导出Excel
                            </button>
                        </div>
                        <div id="myTable">
                            <table id="bootstraptable" class="table table-condensed table-bordered table-hover">
                                <thead>
                                    <tr>
                                        @{
                                            var titleList = ViewBag.Title as List<string>;
                                            foreach (var titleItem in titleList)
                                            {
                                                <th style="width:110px">@titleItem</th>
                                            }
                                        }
                                    </tr>
                                </thead>
                                <tbody>
                                    @{
                                        var dataList = ViewBag.Data as List<StockInfoTableRow>;
                                        var titleBmList = ViewBag.TitleBm as List<string>;

                                        foreach (var dataListItem in dataList)
                                        {
                                            string rowId = dataListItem.RowId;
                                            <tr id="o_@rowId">
                                                @{
                                                    foreach (var dataItem in dataListItem.Data)
                                                    {
                                                        <td style="width:110px">
                                                            @dataItem
                                                        </td>
                                                    }
                                                }
                                            </tr>
                                        }
                                    }
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
@section scripts{
    <script src="~/lib/lodop/LodopFuncs.js"></script>
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                datemin: '@ViewBag.dateMin',
                datemax: '@ViewBag.dateMax',
                search: '',
                SupplierId: '-1',
                MaterialId: '-1',
                UserName: '',
                StockType: 1
            },
            mounted: function () {
                var _self = this;
                _self.$nextTick(function () {
                    //显示active
                    _self.$refs.StockInTjStockOut.parentNode.parentNode.classList.add("active");
                    _self.$refs.StockInTjStockOut.classList.add("active");

                    $('#datemax').datetimepicker({
                        format: 'yyyy-mm-dd',
                        minView: 2,
                        autoclose: true,
                        language: "zh-CN"
                    });
                });
            },
            methods: {
                showL: function () {
                    yui.layershow("入库", "/StockIn/Add", 600, 700);
                },
                searchL: function () {
                    var url = "/StockIn/TjStockOut?dateMax=" + $("#datemax").val();
                    window.location.href = url;
                },
                exportL: function () {
                    var _self = this;
                    var data = {
                        dateMin: $("#datemax").val(),
                        dateMax: $("#datemax").val(),
                        stockType: 1
                    };
                    var index = layer.confirm("您确定要导出吗？", { btn: ["确定", "取消"] }, function () {
                        axios.get('/StockIn/Export?' + Qs.stringify(data), {
                            headers: {
                                'promise': 'promise'
                            },
                            responseType: 'arraybuffer'
                        }).then(function (response) {
                            var type = response.headers['content-type']
                            if (type === "application/json") {
                                var enc = new TextDecoder('utf-8')
                                var res = JSON.parse(enc.decode(new Uint8Array(response.data)))
                                layer.msg(res.Item2, { icon: 2 });
                            } else {
                                console.info(response);
                                let disposition = response.headers['content-disposition']
                                let fileName = decodeURI(disposition.substring(disposition.indexOf('filename=') + 9, disposition.indexOf('filename*=') - 2))
                                console.info(fileName);
                                let blob = new Blob([response.data], { type: 'application/ms-excelapplication/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8' })
                                if (window.navigator.msSaveOrOpenBlob) {
                                    navigator.msSaveBlob(blob, fileName);
                                } else {
                                    var link = document.createElement('a');
                                    link.href = window.URL.createObjectURL(blob);
                                    link.download = fileName;
                                    document.body.appendChild(link);
                                    link.click();
                                    document.body.removeChild(link);
                                    window.URL.revokeObjectURL(link.href);
                                }
                            }
                        }).catch(function (error) {
                            alert("导出失败！");
                        });
                        layer.close(index);
                    });
                }
            }
        });

        function refresh() {
            var url = "/StockIn/NewStockOut?dateMax=" + $("#datemax").val();
            window.location.href = url;
        }

        function cancel(rowid) {
            if (rowid == "0") {
                $("#a_0").hide();
            } else {
                $("#o_" + rowid).show();
                $("#n_" + rowid).hide();
            }
        }

        function edit(rowid) {
            $("#o_" + rowid).hide();
            $("#n_" + rowid).show();
        }

        function save(rowid) {
            var editRowId = "n_" + rowid;
            if (rowid == 0) {
                editRowId = "a_0";
            }
            var ret = addOrUpdate(rowid, editRowId);
            if (ret) {
                $("#o_" + rowid).show();
                $("#n_" + rowid).hide();
                $("#a_0").hide();
            }
        }

        function del(rowid) {
            yui.$axiosget('/StockIn/Delete?id=' + rowid)
                .then(function (response) {
                    console.log(response);
                    if (response.data.Item1) {
                        refresh();
                        return true;
                    } else {
                        alert("操作失败!");
                        return false;
                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
        }

        function add() {
            $("#a_0").show();
        }

        function addOrUpdate(rowid, domRowId) {
            var stockInId = rowid;
            if (rowid == 0) {
                stockInId = "";
            }
            var ccno = "";
            var weight = "";
            var remark = "";
            var go = "";
            var price = "";
            var total = "";
            var mid = "";
            $("#" + domRowId).find("input").each(function () {
                var name = $(this).attr("name");
                var sval = $(this).val();
                switch (name) {
                    case "CcNo":
                        ccno = sval;
                        break;
                    case "Remark":
                        remark = sval;
                        break;
                    case "Go":
                        go = sval;
                        break;
                    case "Price":
                        price = sval;
                        break;
                    case "Total":
                        total = sval;
                        break;
                    default:
                        if (Number.parseFloat(sval) > 0) {
                            mid = name;
                            weight = sval;
                        }
                }
            });
            var data = {
                id: stockInId,
                StockInId: stockInId,
                MaterialId: mid,
                CcNo: ccno,
                Weight: weight,
                Remark: remark,
                StockType: 0,
                Go: go,
                Price: price,
                Total: total,
                Unit: $("#datemax").val(),
                StockType:'1'
            };
            console.log(data);
            yui.$axiospostform('/StockIn/AddOrUpdate', data)
                .then(function (response) {
                    console.log(response);
                    if (response.data.Item1) {
                        refresh();
                        return true;
                    } else {
                        alert("操作失败!");
                        return false;
                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
            return false;
        }

    </script>
}